<template>
	
<view class="">
	<view class="tasks">
		<view class="task" v-for="(item, index) in task_lists" :key="index" v-if="item.is_received">
			<view class="top">
				<view class="icon" @tap="toUserMain(item.user_id)">
					<image :src="item.user_icon" mode=""></image>
				</view>
				<view class="user-info">
					<view class="user-name">
						<text>{{item.user_name}}</text>
					</view>
					<view class="time">
						<text>{{item.time}}</text>
					</view>
				</view>
				<view class="address">
						<view class="">
							<text>{{item.address}}</text>
						</view>
						<view class="">
							<text>电话：{{item.phone}}</text>
						</view>
						
				</view>
			</view>
			<view class="middle">
				<view class="content">
					<text>{{item.content}}</text>
				</view>
				<view class="gain">
					¥{{item.reward}}
				</view>
			</view>
			<view class="bottom">
				<text v-if="!item.is_finished">⌛️任务进行中</text>
				<text v-if="item.is_finished">✅任务完成</text>
				<button type="default"  v-if="!item.is_finished" @tap="checkFinish(item._id,index)">确认完成</button>
			</view>
		</view>
	</view>


	 
</view>



</template>


<script>
	export default {
		data() {
			return {
				task_lists:[],
				user_id:""
			}
		},

		onLoad:function(options){
			this.user_id=options.user_id;
			//this.product_lists
			
			this.getTasks();
		},
		// onShow:function(){
		// 	uni.setTabBarBadge({
		// 	  index: 2,
		// 	  text: store.chats_count.toString()
		// 	})

			
		// },
		// //上拉刷新
		// onPullDownRefresh:function() {
		// 	//模拟加载完成
		// 	this.page=1;
		// 	this.product_lists=[];
		// 	this.getProducts(parseInt(this.page),10);
		// 	setTimeout(function() {
		// 		uni.stopPullDownRefresh();
		// 	}, 50);
		// },
		//上拉刷新
		// onReachBottom:function(){
		// 	console.log("出发上拉刷新事件");
		// 	this.page++;
		// 	this.getProducts(parseInt(this.page),10);
		// },
		methods: {
			getTasks(){
					var that=this;
				uni.showLoading();
				

				uniCloud.callFunction({
					name:"getTasksById",
					data:{
						"user_id":that.user_id,
						"type":1
					},
					success(res) {
						uni.hideLoading();
						let l=res.result.tasks;
						
						if(l.length!=0){
							that.task_lists=that.task_lists.concat(l);
						}
						console.log(that.task_lists);
					},fail(err) {
						console.log(err)
					}
					
				})

				},

			 toUserMain(id){
				 uni.navigateTo({
				 	url:'/pages/user-detail/user-detail?user_id='+id
				 })
			 },

			checkFinish(_id,index){
				this.task_lists[index].is_finished=true;
				uni.showLoading({
					title:"确认完成中"
				})
				uniCloud.callFunction({
					name:"finishTask",
					data:{"_id":_id},
					success(res) {
						uni.hideLoading();
						uni.showToast({
							title:"任务已完成",
							duration:1500
						})
					}
				})
			}  
				


		}
	}
</script>

<style scoped>
	/* 导航栏 */
	.tasks{
		margin:10%;
	}
	.task{
		width: 100%;

		border-radius: 10px 10px;
		background: white;
		padding: 3%;
		display: flex;
		flex-direction: column;
	}

	.top{
		display: flex;
		flex-direction: row;
		font-size: 6px;
	}
	.icon image{
		width: 50px;
		height: 50px;
		border-radius: 50px 50px;
	}
	.user-info{
		margin-left: 3%;
	}
	.address{
		
	}
	.publish-task{
		width: 50px;
		height: 50px;
		background: #fc2d1a !important;
		position: fixed;
		color: #FFFFFF !important;
		left: 80%;
		bottom: 20%;

	}
	.bottom{
		
		padding-right: 2%;
	}
	.bottom text{
		text-align: right;
	}
	.bottom button{
		width: 40%;
		margin-right: 2%;
		font-size: 10px;
		background: red;
		color: #fff;
	}
	.middle{
		width: 98%;

		margin: 2% auto 2% auto;
		padding: 4%;
		border-radius: 10px 10px;
		background: #fefdf4;
	}
	.content{
		border-bottom: #007AFF 1px solid;
	}
	.gain{
		text-align: right;
		color: red;
		font-size: 22px;
	}
</style>
